<template>
    <el-main>
        <el-row :gutter="20">
            <el-card class="box-card" style="min-height: 200px;">
                <div class="row">
                    <charts class="chart" :options="chartOptions"></charts>
                </div>
            </el-card>
        </el-row>
    </el-main>
</template>

<script>
    export default {
        data() {
            return {
                resource: '1',
                chartOptions: {
                    title: {
                        text: '话题量统计'
                    },
                    xAxis: {
                        categories: []
                    },
                    plotOptions: {
                        series: {
                            stacking: 'normal'
                        }
                    },
                    series: []
                },
            }
        },
        created() {
            this.topicCharts()
        },
        methods: {
            topicCharts() {
                const _this = this
                const params = {}
                _this.axios.post(_this.$API.ZHIHUAPI.topicCharts, _this.qs.stringify(params)).then((res) => {
                    res = res.data
                    // console.log(res)
                    if (res.code === 10000) {
                        if (res.hasOwnProperty('data') && Object.keys(res.data).length > 0) {
                            _this.chartOptions.xAxis.categories = res.data.categories
                            _this.chartOptions.series = res.data.seriesData
                        } else {
                            _this.chartOptions.xAxis.categories = []
                            _this.chartOptions.series = []
                        }
                    } else {
                        _this.$message({
                            showClose: false,
                            message: res.message,
                            type: 'error'
                        })
                        _this.chartOptions.xAxis.categories = []
                        _this.chartOptions.series = []
                    }
                }).catch(() => {
                    _this.$message({
                        showClose: false,
                        message: '网络连接失败，请重试！',
                        type: 'error'
                    })
                    _this.chartOptions.xAxis.categories = []
                    _this.chartOptions.series = []
                })
            }
        }
    }
</script>

<style>
</style>
